<template>
	<view class="distBution">
		<u-checkbox-group size="26" @change="checkBoxOne($event, 'distributionSupport')" style="width: 100%; flex-direction: column;" class="mt20">
			<template v-for="(item, index) of list">
				<view class="f-x-bt menu-label f30" :key="index">
					<text class="title" style="flex: 1;">{{ item.label }}</text>
					<u-checkbox :ref="'check' + index" class="ma0" icon-size="20" label-size="26" v-model="item.value" :name="item.name"></u-checkbox>
				</view>
				<my-line :margin="[0, 30]"></my-line>
			</template>
		</u-checkbox-group>
		<view class="mt20 bf" v-if="list[1].value">
			<view class="flex flex-align-center justify-space-between menu-label f30" style="flex: 1;">
				<text class="title" style="margin-right: 40rpx;">就餐方式</text>
				<u-checkbox-group size="26" @change="checkBoxOne($event, 'diningType')">
					<template v-for="(item, index) of listTwo">
						<u-checkbox :class="{ ma1: index == 1 }" icon-size="20" label-size="26" v-model="item.value" :name="item.name">{{ item.label }}</u-checkbox>
					</template>
				</u-checkbox-group>
			</view>
			<my-line :margin="[0, 30]"></my-line>
			<view class="flex flex-align-center justify-space-between menu-label f30" @click="go({ url: '/components/my-map', t: 1 })">
				<text class="title" style="margin-right: 40rpx;">自提地址</text>
				<view class="flex flex-align-center">
					<text class="title">{{ fromData.address }}</text>
					<uni-icons type="arrowright"></uni-icons>
				</view>
			</view>
			<my-line :margin="[0, 30]"></my-line>
			<view class="flex flex-align-center justify-space-between menu-label f30">
				<text class="title" style="margin-right: 40rpx;">经纬度</text>
				<view class="flex flex-align-center">
					<button class="btnText" type="default">{{ fromData.lat || '000.000' }}</button>
					<button class="btnText" type="default">{{ fromData.lng || '00.00' }}</button>
				</view>
			</view>
		</view>
		<my-button :fiexd="true" @confirm="submit">保存</my-button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [
				{
					label: '外卖配送',
					value: false,
					name: 1
				},
				{
					label: '到店自提',
					value: false,
					name: 2
				}
			],
			listTwo: [
				{
					label: '店内就餐',
					value: false,
					name: 1
				},
				{
					label: '打包带走',
					value: false,
					name: 2
				}
			],
			fromData: {
				ident: 'takeOutSet',
				distributionSupport: [],
				diningType: [],
				address: '',
				lat: '',
				lng: ''
			}
		};
	},
	onLoad() {
		uni.$on('getAddressInfo', this.address);
	},
	onUnload() {
		uni.$off('getAddressInfo');
	},
	methods: {
		address(msg) {
			this.fromData.address = msg.city + msg.address + msg.name;
			this.fromData.lat = msg.point.latitude;
			this.fromData.lng = msg.point.longitude;
		},
		checkBoxOne(msg, key) {
			this.fromData[key] = msg;
		},
		submit() {
			this.util
				.request({
					url: this.api.strogConfig,
					method: 'POST',
					ct: true,
					data: this.fromData
				})
				.then(res => {
					if (res.code == 1) {
						this.util.message('保存成功！', 3);
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							});
						}, 1000);
					} else {
						this.util.message(res.msg, 3);
					}
				});
		}
	}
};
</script>

<style lang="scss" scoped>
.distBution {
	height: 100vh;

	.menu-label {
		width: 100%;
		padding: 20rpx 30rpx;
		background: #ffffff;

		.title {
			min-width: 120rpx;
		}

		.ma0 {
			/deep/.u-checkbox__label {
				margin: 0rpx;
			}
		}

		.ma1 {
			/deep/.u-checkbox__label {
				margin-right: 0rpx;
			}
		}

		.btnText {
			font-size: 28rpx;
			color: #999;
			background: #eff3f6;
			margin: 0rpx 0rpx 0rpx 20rpx;

			&::after {
				width: auto;
				height: auto;
				border: none;
			}
		}
	}
}
</style>
